import React, { Component } from 'react'
import RouterViews from '../../router/router.view'
import './index.css'

export default class Home extends Component {


    state={
        nav:[
            {
                name:'首页',
                icon:'',
                path:'/home/main'
            },
            {
                name:'二维码',
                icon:'',
                path:'/home/qr'
            },
            {
                name:'我的',
                icon:'',
                path:'/home/my'
            }
        ],
        defaultActive:0
    }



    setNav = (key,path) =>{
        
        this.setState({defaultActive:key})
        this.props.history.push(path)
    }


    render() {
        const {nav,defaultActive} = this.state
        return (
            <div className="home">
                
                <RouterViews routers={this.props.routers}/>
            
                {/* 底部导航 */}
                <div className="footer">
                    {
                        nav.map((item,key)=><span key={key} className={defaultActive===key?'active':''} onClick={()=>this.setNav(key,item.path)}>{item.name}</span>)
                    }
                </div>

            </div>
        )
    }
}
